.ttl {
    position: relative;
    margin: 50px auto 0;
    width: 500px;
    height: 100px;
    text-align: center;
    line-height: 100px;
    /* background-color: pink; */
}

.ttl p {
    color: yellow;
    font-size: 40px;
}

img {
    position: absolute;
    right: 0;
    top: 50px;
    transform: translateY(-50%);
}

.reg {
    position: relative;
    height: 400px;
    border: 2px solid #ccc;
}

.reg p {
    line-height: 30px;
    color: #e4e4e4;
    border: 1px dotted #ccc;
}

.content {
    position: absolute;
    top: 100px;
    left: 250px;
    transform: translateX(-50%);
    text-align: center;
    /* background-color: purple; */
}

.content li {
    position: relative;
    margin: 10px 0;
    line-height: 35px;
}

.content li:nth-child(-n+4) {
    transform: translateX(50px);
}

.content li input {
    width: 200px;
    height: 30px;
    outline: none;
}

.content li:nth-child(1)::before {
    content: "请输入用户名：";
    position: absolute;
    right: 360px;
}

.content li:nth-child(2)::before {
    content: "请输入密码：";
    position: absolute;
    right: 360px;
}


.content li:nth-child(3)::before {
    content: "确认密码：";
    position: absolute;
    right: 360px;
}

.content li:nth-child(4)::before {
    content: "邀请码：";
    position: absolute;
    right: 360px;
}

.content li:nth-child(5) input {
    content: "";
    /* display: block; */
    border: 1px solid #ccc;
    background-color: blanchedalmond;
    cursor: pointer;
    width: 50px;
    height: 25px;
}

.content li:nth-child(6) input {
    width: 15px;
    height: 15px;
    vertical-align: middle;
}